<!DOCTYPE html>
<html>
<head>
    <title></title>
    <meta charset="UTF-8">
    <link rel="stylesheet" type="text/css" href="../../Css/bootstrap.css"/>
    <link rel="stylesheet" type="text/css" href="../../Css/bootstrap-responsive.css"/>
    <link rel="stylesheet" type="text/css" href="../../Css/style.css"/>
    <script type="text/javascript" src="../../Js/jquery.js"></script>
    <script type="text/javascript" src="../Js/jquery.sorted.js"></script>
    <script type="text/javascript" src="../../Js/bootstrap.js"></script>
    <script type="text/javascript" src="../../Js/ckform.js"></script>
    <script type="text/javascript" src="../../Js/common.js"></script>
    <script type="text/javascript" src="../../Js/cusz/roleUtils.js"></script>

    <style type="text/css">
        body {
            padding-bottom: 40px;
        }

        .sidebar-nav {
            padding: 9px 0;
        }

        @media (max-width: 980px) {
            /* Enable use of floated navbar text */
            .navbar-text.pull-right {
                float: none;
                padding-left: 5px;
                padding-right: 5px;
            }
        }


    </style>
</head>
<body>
<form action="index.html" method="post" class="definewidth m20">
    <table class="table table-bordered table-hover definewidth m10">
        <input id="rId" name="rId" type="hidden" value="-1">
        <tr>
            <td width="10%" class="tableleft">角色名称</td>
            <td><input type="text" name="rName" value="管理员"/></td>
        </tr>
        <tr>
            <td class="tableleft">状态</td>
            <td>
                <input type="radio" name="rState" value="0" checked/> 启用
                <input type="radio" name="rState" value="1"/> 禁用
            </td>
        </tr>
        <tr>
            <td class="tableleft">权限</td>
            <td id="resourceMenu">
                <ul><label class='checkbox inline'><input type='checkbox' checked name='group[]'
                                                          value=''/>挂号信息管理</label></ul>
            </td>
        </tr>
        <tr>
            <td class="tableleft"></td>
            <td>
                <button onclick="roleSave()" class="btn btn-primary" type="button">更新</button> &nbsp;&nbsp;<button
                    type="button" class="btn btn-success" name="backid" id="backid">返回列表
            </button>
            </td>
        </tr>
    </table>
</form>
</body>
</html>
<script>
    String.prototype.GetValue = function (para) {
        let reg = new RegExp("(^|&)" + para + "=([^&]*)(&|$)");
        let r = this.substr(this.indexOf("\?") + 1).match(reg);
        if (r != null) return unescape(r[2]);
        return null;
    }

    $(function () {
        // 查询所有菜单资源
        loadResourceMenu();

        selectById();

        $(':checkbox[name="group[]"]').click(function () {
            $(':checkbox', $(this).closest('li')).prop('checked', this.checked);
        });

        $('#backid').click(function () {
            window.location.href = "index.html";
        });

    });

    function selectById() {
        // 查询当前角色信息
        let url = document.location.toString();
        let rId = url.GetValue("rId");

        $("input[name='rId']").val(rId);

        // alert("edit, rId = " + rId);
        // 通过 ID 获取数据
        $.ajax({
            type: "GET",
            url: "/role/" + rId,
            success: function (res) {
                console.log(res)
                // $("input[name='rId']").val(res.obj.rId);
                $("input[name='rName']").val(res.obj.rName);
                let rState = res.obj.rState;
                if (rState === 0) {
                    $("input[name='rState']").get(0).checked = true;
                } else if (rState === 1) {
                    $("input[name='rState']").get(1).checked = true;
                }

                let mIdList = res.obj.midList;
                // console.log(typeof mIdList)
                // console.log(Array.isArray(mIdList))
                // console.log(mIdList);
                let allMIdList = $(':checkbox[name="group[]"]');
                allMIdList.each(function () {
                    let elem = $(this).val();
                    // console.log("elem = " + elem);
                    for (let i = 0; i < mIdList.length; i++) {
                        let b = mIdList[i] == elem;
                        // console.log("mIdList[" + i + "] = " + mIdList[i])
                        // console.log("mIdList[i] == elem ? " + b);
                        if (b) {
                            $(this).prop("checked", true);
                            break;
                        }
                    }
                })
            }
        })
    }
</script>